// app子模块
export default {
  /**
   * 命名空间：都推荐给加上
   *   加上之后的好处：
   *      1. 避免多个子模块有相同名字 getter、mutation、action 的冲突
   *   坏处：
   *      1. 组件上使用时，需要加上具体要操作的子模块的模块名
   *
   *        getter:   xx模块名/xxGetter
   *        mutation: xx模块名/xxMutation
   *        action:   xx模块名/xxAction
   *
   *   辅助函数的操作也有变化
   *      1. mapState(['appName'])  => mapState('模块名字', ['appName'])
   *      2. mapGetters(['xxGetter']) => mapGetters('模块名字', ['xxGetter'])
   *      3. mapMutations(['xx']) => mapMutations('模块名字', ['xx'])
   *      4. mapActions(['xx']) => mapActions('xx', ['xx'])
   */
  namespaced: true,

  state() {
    return {
      appName: "2213-后台管理系统",
    };
  },
  getters: {
    appNameLength(state) {
      return state.appName.length;
    },
  },
  mutations: {
    changeAppName(state, payload) {
      console.log("app - changeAppName");
      state.appName = payload;
    },
  },
  actions: {
    asyncChangeName({ commit }, payload) {
      setTimeout(() => {
        commit("changeAppName", payload);
      }, 2000);
    },
  },
};
